<template>
  <VDialog
    @close="handleClose"
    @save="save"
    :loading="loading"
    width="700px"
    title="批量复制用户权限"
  >
    <template #content>
      <div class="p-[20px]">
        <div>
          <span>
            已选中:
            <span class="ml-[2px] mr-[6px] text-[#da0014]">
              {{ ids?.length || 0 }}
            </span>
            条
          </span>
        </div>
        <div class="flex items-center mt-[10px]">
          <span>复制勾选用户:</span>
          <VCascader
            v-model="user_id"
            :multiple="false"
            key="user_id"
            class="w-[200px] px-[10px]"
            placeholder="人员"
            :isSelfStyle="false"
          />

          <span>的所有权限给选中的账号!</span>
        </div>
      </div>
    </template>
  </VDialog>
</template>
<script setup>
import { ElMessage } from "element-plus";
import api from "../../api/index";
const props = defineProps({
  ids: { type: Array, default: () => [] },
});
const { ids } = toRefs(props);
const user_id = ref(null);
const emit = defineEmits(["update:modelValue", "close", "refresh"]);
const loading = ref(false);
const handleClose = async (refresh) => {
  user_id.value = null;
  emit("update:modelValue", false);
  emit("close");
  if (refresh) emit("refresh");
};
const save = async () => {
  try {
    loading.value = true;
    let { code, message } = await api.batchCopyUser({
      from_user_id: user_id.value,
      to_tu_id: ids.value,
    });
    if (code !== 200) return ElMessage.warning(message);
    ElMessage.success("复制成功!");
    handleClose(true);
  } catch (error) {
  } finally {
    loading.value = false;
  }
};
</script>
